<template>
    <div>
       <!-- 一个组件上的 v-model 默认会利用名为 value 的 prop 和
       名为 input 的事件。 -->
        <input type="text" :value="vModel"  @input="inputComponent($event)"
        >
        子组件：{{vModel}}
    </div>
</template>

<script>
    export default {
        //你可以提供一个 model 属性，用来定义该组件以何种方式支持 v-model
        model: {
            //代表 v-model 绑定的prop名
            prop: 'vModel', // 对应 props
            //代表 v-model 通知父组件更新属性的事件名,
            //通过@input来反复触碰
            event: 'change'
        },
        props:{
            
            vModel:{ 
                type:String,
                default: ''
            }
        },
        methods:{
            inputComponent(event){        
                this.$emit('change', event.target.value)      
            }
        }
    }
</script>

<style lang="scss" scoped>

</style>